<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" type="text/css" href="t_1.2.css">
</head>
<body>
	<div class="header">
		<img src="imgs/baidu.png" alt="百度图片">
		<ul>
			<li><a href="#">导航链接1</a></li>
			<li><a href="#">导航链接2</a></li>
			<li><a href="#">导航链接3</a></li>
			<li><a href="#">导航链接4</a></li>
		</ul>
	</div>
	<div class="article" id="article1">
		<h2>文章一级标题</h2>
		<h4>文章二级标题</h4>
		<span>文章作者 文章发布时间</span>
		<p class="suojin">这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了<br/>
		这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了<br/>
		这是一个很长很长的段落，这是一个很长很长的段落，<a href="http://ife.baidu.com">这里有一个链接链接到http://ife.baidu.com</a>这是一个很长很长的段落，这是一个很长很长的段落，<b>这里有个粗体字</b>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落。
		</p>
		<img src="imgs/Gerrard.jpg" / alt="图片酷酷的">
		<p class="suojin">这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了<br/>
		这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，<b>这里有个粗体字</b>这是一个很长很长的段落，这是一个很长很长的段落，<a href="" target="_blank">这里有一个链接打开新窗口链接到http://ife.baidu.com</a>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落
		</p>
	</div>
	<div class="article" id="article2">
		<h2>另一篇文章一级标题</h2>
		<h4>文章二级标题</h4>
		<span>文章作者 文章发布时间</span>
		<p class="suojin">这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了<br/>
		这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了<br/>
		这是一个很长很长的段落，这是一个很长很长的段落，<a href="http://ife.baidu.com">这里有一个链接链接到http://ife.baidu.com</a>这是一个很长很长的段落，这是一个很长很长的段落，<b>这里有个粗体字</b>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落。
		</p>
		<img src="imgs/Gerrard.jpg" / alt="图片酷酷的">
		<ul>
			<li>列表项目一</li>
			<li>列表项目二</li>
			<li>列表项目三</li>
		</ul>
	</div>
	<div class="article" id="article3">
		<h2>图片</h2>
		<ul>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
			<li><span>好看的图片</span><img src="imgs/Gerrard.jpg" / alt="图片酷酷的"></li>
		
		</ul>
	</div>
	<div class="article" id="article4">
		<h2>最后一篇文章一级标题</h2>
		<h2>文章二级标题</h2>
		<p>文章作者 文章发布时间</p>
		<ol>
			<li>排名1</li>
			<li>排名2</li>
			<li>排名3</li>
		</ol>
		<span>下面是一个表格，给表格加了一个border="1"好让你看出是一个表格</span>
		<table>
			<tr>
				<th>表头</th>
				<th>表头</th>
				<th>表头</th>
			</tr>
			<tr>
				<td>表内容单元格</td>
				<td>表内容单元格</td>
				<td><a href="#">操作</a></td>
			</tr>
			<tr>
				<td>表内容单元格</td>
				<td>表内容单元格</td>
				<td><a href="#">操作</a></td>
			</tr>
			<tr>
				<td>表内容单元格</td>
				<td>表内容单元格</td>
				<td><a href="#">操作</a></td>
			</tr>
			<tr>
				<td>表内容单元格</td>
				<td>表内容单元格</td>
				<td><a href="#">操作</a></td>
			</tr>
			<tr>
				<td>总计</td>
				<td colspan="2">1000</td>
			</tr>
		</table>
	</div>
	<div class="sidebar">
		<h3>这里以后是一个侧栏，这是侧栏的标题</h3>
		<form action="#">
			<label>请输入邮箱地址</label>
			<input type="text" placeholder="这是一个文本输入框">
			<p class="tips">邮箱地址请按格式要求输入</p>
			<label>请输入密码</label>
			<input type="password" placeholder="这是一个文本输入框"><br />
			<label>请重复输入密码</label>
			<input type="password" placeholder="这是一个文本输入框">
			<p class="tips">密码请为6~16位英文数字</p>
			<label>性别</label>
			<input type="radio" name="sex" checked="checked" value="male">男<input type="radio" name="sex" value="female">女<br />
			<label>城市</label>
			<select name="city">
				<option selected="selected">北京</option>
				<option>广州</option>
			</select><br />
			<label>爱好</label>
			<input type="checkbox" name="sport" value="sport">运动</span>
			<input type="checkbox" name="art" value="art"><span>艺术</span>
			<input type="checkbox" name="science" value="science">科学
			<br />
			<label>个人描述</label>
			<textarea placeholder="这是一个多行输入框，输入您的个人描述"></textarea><br/>
			<input type="submit" value="确认提交" >
		</form>
		
	</div>
	<div class="footer">
		<p>@版权所有</p> 
	</div>
</body>
</html>